<template>
    <h1>用户列表</h1>
    <a-table 
        :dataSource="list"
        :columns="columns">
        <template #bodyCell="{ column, record }">
            <template v-if="column.key === 'auth'">
                {{record.auth==1?'超级管理员':'普通管理员'}}
            </template>
            <template v-if="column.key === 'image'">
                <a-avatar :src="record.image"></a-avatar>
            </template>
        </template>
    </a-table>
</template>

<script lang='ts' setup>
import api from '@/api';
import {onBeforeMount,ref} from 'vue'
import IUserItem from '@/types/IUserItem'
let list=ref<Array<IUserItem>>([])
const columns = [
      {
        title: "用户名",
        dataIndex: "username",
        key: "username",
      },
      {
        title: "邮箱",
        dataIndex: "email",
        key: "email",
      },
      {
        title: "电话",
        dataIndex: "phone",
        key: "phone",
      },
      {
        title: "角色",
        dataIndex: "auth",
        key: "auth",
      },
      {
        title: "头像",
        dataIndex: "image",
        key: "image",
      },
]
const getUsers=async()=>{
    let result=await api.users.getUsers()
    list.value=result.data.data.result
    console.log('list',result.data.data.result);
    
}
onBeforeMount(()=>{
    getUsers()
})
</script>

<style lang='scss' scoped>
</style>